<template>
	<view>
		<!-- 右侧添加好友开始 -->
		<!-- 遮罩 -->
		<UserItem :isShow="isShow" @addUserClick="addUser" @clearClick="clear" @hiddenBtn="hiddenMask"></UserItem>
		<!-- 右侧添加好友结束 -->

		<!-- 聊天信息列表开始 -->
		<block v-for="(item, index) in list" :key="index"><ChatItem :item="item" @tap="goTo"></ChatItem></block>
		<!-- 聊天信息列表结束 -->
		<!-- 上拉加载 -->
		<PullUpLoad :loadtext="loadtext"></PullUpLoad>
	</view>
</template>

<script>
import ChatItem from '@/components/news/chatItem/chat-list.vue';
import UserItem from '@/components/news/user-item/user-item';
import PullUpLoad from '../../components/pullUpLoad/pullUpLoad';
export default {
	components: { 
		ChatItem,
		PullUpLoad,
		UserItem
	},
	data() {
		return {
			loadtext: '上拉加载更多',
			// 控制添加好友组件的显示隐藏
			isShow: false,
			list: [  
				{
					userpic: '../../../static/demo/userpic/12.jpg',
					username: '昵称',
					time: '10:21',
					data: '我是信息',
					noreadnum: 2
				},
				{
					userpic: '../../../static/demo/userpic/12.jpg',
					username: '昵称',
					time: '10:21',
					data: '我是信息',
					noreadnum: 0
				},
				{
					userpic: '../../../static/demo/userpic/12.jpg',
					username: '昵称',
					time: '10:21',
					data: '我是信息',
					noreadnum: 0
				},
				{
					userpic: '../../../static/demo/userpic/12.jpg',
					username: '昵称',
					time: '10:21',
					data: '我是信息',
					noreadnum: 11
				},
				{
					userpic: '../../../static/demo/userpic/12.jpg',
					username: '昵称',
					time: '10:21',
					data: '我是信息',
					noreadnum: 2
				},
				{
					userpic: '../../../static/demo/userpic/12.jpg',
					username: '昵称',
					time: '10:21',
					data: '我是信息',
					noreadnum: 0
				},
				{
					userpic: '../../../static/demo/userpic/12.jpg',
					username: '昵称',
					time: '10:21',
					data: '我是信息',
					noreadnum: 0
				},
				{
					userpic: '../../../static/demo/userpic/12.jpg',
					username: '昵称',
					time: '10:21',
					data: '我是信息',
					noreadnum: 11
				}
			]
		};
	},
	// 监听上拉加载
	onReachBottom() {
		this.pullUpLoad();
	},
	// 下拉刷新
	onPullDownRefresh() {
		setTimeout(() => {
			// 获取数据
			let arr = [
				{
					userpic: '../../../static/demo/userpic/12.jpg',
					username: '昵称',
					time: '10:21',
					data: '我是信息',
					noreadnum: 0
				},
				{
					userpic: '../../../static/demo/userpic/12.jpg',
					username: '昵称',
					time: '10:21',
					data: '我是信息',
					noreadnum: 11
				}
			];
			// 赋值
			this.list = arr;
			// 停止刷新
			uni.stopPullDownRefresh();
		}, 2000);
	},
	methods: {
		// 上拉加载更多
		pullUpLoad() {
			// 判断数据
			if (this.loadtext !== '上拉加载更多') {
				return;
			}
			// 修改状态
			this.loadtext = '加载中...';
			setTimeout(() => {
				let obj = {
					userpic: '../../../static/demo/userpic/12.jpg',
					username: '昵称',
					time: '10:21',
					data: '我是信息',
					noreadnum: 11
				};

				this.list.push(obj);
				this.loadtext = '上拉加载更多';
			}, 1000);
			// this.news[index].loadtext = '没有加载的数据'
		},
		addUser() {
			this.isShow = false;
		},
		clear() {
			this.isShow = false;
		},
		// 点击遮罩关闭
		hiddenMask() {
			this.isShow = false;
		},
		// 监听原生导航栏
		onNavigationBarButtonTap(e) {
			let index = e.index;
			switch (index) {
				case 0:
					uni.navigateTo({
						url:'../users/users'
					}) 
					break;
				case 1:
					this.isShow = true;
				default:
					break;
			}  
		}
	,
	goTo(){
		uni.navigateTo({
			url:'../user-chat/user-chat'
		})
	}
	}
};
</script>

<style lang="less" scoped></style>
